<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" href="../css/page3.css">
		<title></title>
	</head>
	<body>
		<audio id="music" autoplay="autoplay" loop="loop">       
    		<source src="../media/bgm.mp3" type="audio/mpeg" />
        </audio>
		<div class="page3">
			 <img src="../images/p3-3.jpg" class="img3"/>
			 <img src="../images/p3-1.gif" class="img1"/>
		     <img src="../images/p3-2.gif" class="img2"/>
		     <img src="../images/p3-4.jpg" class="img4"/>
		     <img src="../images/p3-5.jpg" class="img5"/>
		     <img src="../images/p3-6.jpg" class="img6"/>
		     <img src="../images/p3-7.jpg" class="img7"/>
		</div>
		<script src="jquery-1.11.3.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$('.img1').animate({
				left:0,				
			},1000);
			$('.img2').delay(1000).animate({
				left:0,
			},1000);
			$('.img4').delay(1000).animate({
				left:'0.38rem',				
			},1000);
            $('.img6').delay(2000).animate({
				opacity:'1'				
			},1000);
            $('.img5').delay(1000).animate({
				right:'0.26rem'				
			},1000);
			$('.img7').delay(2000).animate({
				opacity:'1'				
			},1000);
		</script>
	</body>
</html>
